<!DOCTYPE html>
<html class="page" lang="ru">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Device-shop</title>
  <link rel="stylesheet" href="css/styles.css">
</head>

<body class="page__body">
  <header class="main-header">
    <div class="main-header__wrapper">
      <a class="main-header__logo logo" href="index.html">
        <svg class="logo__icon" width="145" height="36" viewBox="0 0 145 36" fill="none"
          xmlns="http://www.w3.org/2000/svg">
          <path
            d="M27.2188 0V35.3H19.6135V32.9C17.9124 34.8 15.5107 36 12.1084 36C5.5038 36 0 30.2 0 22.7C0 15.2 5.5038 9.4 12.1084 9.4C15.5107 9.4 18.0124 10.6 19.6135 12.5V0H27.2188ZM19.6135 22.7C19.6135 18.9 17.1118 16.5 13.6094 16.5C10.107 16.5 7.60524 18.9 7.60524 22.7C7.60524 26.5 10.107 28.9 13.6094 28.9C17.1118 28.8 19.6135 26.5 19.6135 22.7Z" />
          <path
            d="M43.7298 29.1999C45.8313 29.1999 47.5325 28.3999 48.5332 27.2999L54.6374 30.7999C52.1356 34.1999 48.4331 35.9999 43.6298 35.9999C35.0238 35.9999 29.6201 30.1999 29.6201 22.6999C29.6201 15.1999 35.0238 9.3999 43.0294 9.3999C50.4345 9.3999 55.8382 15.0999 55.8382 22.6999C55.8382 23.7999 55.7381 24.7999 55.538 25.6999H37.6256C38.6263 28.2999 40.9279 29.1999 43.7298 29.1999ZM48.333 20.0999C47.5325 17.1999 45.2309 16.0999 42.9293 16.0999C40.0273 16.0999 38.126 17.4999 37.4255 20.0999H48.333Z" />
          <path
            d="M82.1563 10.1001L72.8499 35.3001H64.2439L54.9375 10.1001H63.3433L68.647 26.1001L73.9506 10.1001C73.9506 10.1001 82.1563 10.1001 82.1563 10.1001Z" />
          <path d="M83.458 10.1001H91.0633V35.3001H83.458V10.1001Z" />
          <path
            d="M93.665 22.6999C93.665 15.1999 99.369 9.3999 107.074 9.3999C111.978 9.3999 116.281 11.9999 118.482 15.8999L111.878 19.6999C110.977 17.8999 109.176 16.8999 106.974 16.8999C103.672 16.8999 101.27 19.2999 101.27 22.6999C101.27 26.1999 103.672 28.4999 106.974 28.4999C109.176 28.4999 111.077 27.3999 111.878 25.6999L118.482 29.4999C116.381 33.3999 112.078 35.9999 107.074 35.9999C99.369 35.9999 93.665 30.1999 93.665 22.6999Z" />
          <path
            d="M132.892 29.1999C134.993 29.1999 136.695 28.3999 137.695 27.2999L143.799 30.7999C141.298 34.1999 137.595 35.9999 132.792 35.9999C124.186 35.9999 118.782 30.1999 118.782 22.6999C118.782 15.1999 124.286 9.3999 132.191 9.3999C139.597 9.3999 145 15.0999 145 22.6999C145 23.7999 144.9 24.7999 144.7 25.6999H126.788C127.788 28.2999 130.09 29.1999 132.892 29.1999ZM137.595 20.0999C136.795 17.1999 134.493 16.0999 132.191 16.0999C129.289 16.0999 127.388 17.4999 126.688 20.0999H137.595Z" />
          <path d="M83.458 0V10.1L91.0633 0H83.458Z" />
        </svg>
      </a>
      <nav class="main-nav">
        <div class="main-nav__list user-nav">
          <form class="user-seach" action="https://echo.htmlacademy.ru/" method="post">
            <label class="visually-hidden" for="site-seach">Поиск по сайту</label>
            <input class="user-seach__input" type="search" name="site-seach" id="site-seach" placeholder="Текст поиска">
            <button class="user-seach__button" type="submit">Найти</button>
          </form>
          <ul class="user-nav__list user-list user-login user-login--sign-out">
            <li class="user-nav__item user-login__item--sign-in">
              <a href="#">
                <svg class="user-nav__icon" aria-hidden="true" focusable="false" width="15" height="13"
                  viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                  <path
                    d="M0 12.787H13C12.8 10.187 10.9 7.98699 8.3 7.28699C9.3 6.68699 10 5.58699 10 4.28699C10 2.38699 8.4 0.786987 6.5 0.786987C4.6 0.786987 3 2.38699 3 4.28699C3 5.58699 3.7 6.68699 4.7 7.28699C2.1 7.98699 0.2 10.187 0 12.787Z"
                    fill="black" />
                </svg>
                Войти</a>
            </li>
            <li class="user-nav__item user-login__item--sign-out">
              <a href="#">Пользователь</a>
            </li>
            <li class="user-nav__item user-login__item--sign-out">
              <a>Выйти</a>
            </li>
          </ul>
          <ul class="user-nav__list user-list">
            <li class="user-nav__item">
              <a href="#">
                <svg class="user-nav__icon" aria-hidden="true" focusable="false" width="10" height="12"
                  viewBox="0 0 10 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                  <path d="M6 0.388916H4V12.3889H6V0.388916Z" fill="black" />
                  <path d="M2 4.38892H0V12.3889H2V4.38892Z" fill="black" />
                  <path d="M10 3.38892H8V12.3889H10V3.38892Z" fill="black" />
                </svg>
                Сравнить</a>
            </li>
            <li class="user-nav__item user-list__cart">
              <a href="#">
                <svg class="user-nav__icon" aria-hidden="true" focusable="false" width="16" height="14"
                  viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
                  <path
                    d="M15.3 5.38892L11.8 5.58892L8.6 0.688916C8.5 0.488916 8.2 0.388916 8 0.388916C7.8 0.388916 7.5 0.488916 7.4 0.688916L4.2 5.58892H0.7C0.3 5.58892 0 5.88892 0 6.28892C0 6.38892 0 6.38892 0 6.48892L1.9 13.2889C2.1 13.9889 2.6 14.3889 3.3 14.3889H12.7C13.4 14.3889 13.9 13.9889 14.1 13.2889L16 6.38892C16 6.28892 16 6.28892 16 6.18892C16 5.78892 15.7 5.38892 15.3 5.38892ZM8 2.28892L10.2 5.48892H5.9L8 2.28892Z"
                    fill="black" />
                </svg>
                Корзина</a>
            </li>
          </ul>
        </div>
        <div class="main-nav__list site-nav">
          <div class="nav-catalog">
            <button class="nav-catalog__button" type="button">Каталог товаров</button>
            <button class="nav-catalog__toggle" type="button">
              <svg class="nav-catalog__icon nav-catalog__icon--closed" width="16" height="17" viewBox="0 0 16 17"
                fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M16 7.78699H9V0.786987H7V7.78699H0V9.78699H7V16.787H9V9.78699H16V7.78699Z" />
              </svg>
              <svg class="nav-catalog__icon nav-catalog__icon--opened" width="16" height="3" viewBox="0 0 16 3"
                fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M16 0.777832H0V2.77783H16V0.777832Z" />
              </svg>
              <span class="visually-hidden">Открыть подкаталог</span>
            </button>
            <ul class="nav-catalog__main-list">
              <ul class="nav-catalog__list">
                <li class="nav-catalog__item">
                  <a href="#">Виртуальная реальность</a>
                </li>
                <li class="nav-catalog__item">
                  <a href="#">Моноподы для селфи</a>
                </li>
                <li class="nav-catalog__item">
                  <a href="#">Экшн-камеры</a>
                </li>
              </ul>
              <ul class="nav-catalog__list">
                <li class="nav-catalog__item">
                  <a href="#">Фитнес-браслеты</a>
                </li>
                <li class="nav-catalog__item">
                  <a href="#">Умные часы</a>
                </li>
              </ul>
              <ul class="nav-catalog__list">
                <li class="nav-catalog__item">
                  <a href="#">Квадрокоптеры</a>
                </li>
              </ul>
            </ul>
          </div>
          <ul class="site-nav__list site-list">
            <li class="site-list__item">
              <a href="#">Доставка</a>
            </li>
            <li class="site-list__item">
              <a href="#">Гарантия</a>
            </li>
            <li class="site-list__item">
              <a href="#">Контакты</a>
            </li>
          </ul>
        </div>
    </div>
  </header>
  <main class="main-catalog">
    <header class="catalog-header">
      <div class="catalog-header__wrapper">
        <h1 class="visually-hidden">Каталог товаров</h1>
        <h2 class="catalog-header__title">Моноподы для селфи</h2>
        <ul class="catalog-header__list breadcrumbs">
          <li class="breadcrumbs__item">
            <a class="breadcrumbs__link" href="index.html">Главная</a>
          </li>
          <li class="breadcrumbs__item">
            <a class="breadcrumbs__link" href="#">Каталог товаров</a>
          </li>
          <li class="breadcrumbs__item">
            <a class="breadcrumbs__link" href="#">Моноподы для селфи</a>
          </li>
        </ul>
      </div>
    </header>
    <section class="catalog-products">
      <div class="catalog-products__wrapper">
        <h2 class="visually-hidden">Список товаров с фильтрами</h2>
        <form class="catalog-filter" action="https://echo.htmlacademy.ru/" method="post">
          <h3 class="catalog-products__title">Фильтр:</h3>
          <fieldset class="catalog-filter__group">
            <legend class="catalog-filter__title">Стоимость</legend>
            <div class="catalog-filter__range range">
              <div class="range__scale">
                <div class="range__bar" style="left: 0; width: 119px;">
                  <button class="range__toggle range__toggle--min" type="button">
                    <span class="visually-hidden">Изменить минимальную цену.</span>
                  </button>
                  <button class="range__toggle range__toggle--max" type="button">
                    <span class="visually-hidden">Изменить максимальную цену.</span>
                  </button>
                </div>
              </div>
              <div class="range__inputs">
                <label class="range__label">
                  от<input class="range__input range__input--min" type="number" value="0" name="min-price">
                </label>
                <label class="range__label">
                  до<input class="range__input range__input--max" type="number" value="5000" name="max-price">
                </label>
              </div>
            </div>
          </fieldset>
          <fieldset class="catalog-filter__group">
            <legend class="catalog-filter__title">Цвет</legend>
            <ul class="catalog-filter__list">
              <li class="catalog-filter__item">
                <label class="control">
                  <input class="visually-hidden control__input" type="checkbox" name="Черный" checked>
                  <span class="control__mark"></span>
                  <span class="control__label">Черный</span>
                </label>
              </li>
              <li class="catalog-filter__item">
                <label class="control">
                  <input class="visually-hidden control__input" type="checkbox" name="Белый" checked>
                  <span class="control__mark"></span>
                  <span class="control__label">Белый</span>
                </label>
              </li>
              <li class="catalog-filter__item">
                <label class="control">
                  <input class="visually-hidden control__input" type="checkbox" name="Синий">
                  <span class="control__mark"></span>
                  <span class="control__label">Синий</span>
                </label>
              </li>
              <li class="catalog-filter__item">
                <label class="control">
                  <input class="visually-hidden control__input" type="checkbox" name="Красный">
                  <span class="control__mark"></span>
                  <span class="control__label">Красный</span>
                </label>
              </li>
              <li class="catalog-filter__item">
                <label class="control">
                  <input class="visually-hidden control__input" type="checkbox" name="Розовый">
                  <span class="control__mark"></span>
                  <span class="control__label">Розовый</span>
                </label>
              </li>
            </ul>
          </fieldset>
          <fieldset class="catalog-filter__group">
            <legend class="catalog-filter__title">Bluetooth</legend>
            <ul class="catalog-filter__list">
              <li class="catalog-filter__item">
                <label class="control">
                  <input class="visually-hidden control__input" type="radio" name="bluetooth" value="yes" checked>
                  <span class="control__mark"></span>
                  <span class="control__label">Есть</span>
                </label>
              </li>
              <li class="catalog-filter__item">
                <label class="control">
                  <input class="visually-hidden control__input" type="radio" name="bluetooth" value="no">
                  <span class="control__mark"></span>
                  <span class="control__label">Нет</span>
                </label>
              </li>
            </ul>
          </fieldset>
          <button class="catalog-filter__button button" type="submit">Показать</button>
        </form>
        <div class="catalog">
          <div class="sorting">
            <h3 class="catalog-products__title">Сортировка:</h3>
            <form class="sorting__type" action="https://echo.htmlacademy.ru/" method="post">
              <div class="sorting__select select">
                <label class="visually-hidden" for="sorting">Сортировка</label>
                <select class="select__control" id="sorting" name="sorting">
                  <option value="popular">Популярные</option>
                  <option value="cheap">Сначала дешёвое</option>
                  <option value="expensive">Сначала дорогое</option>
                </select>
              </div>
              <button class="visually-hidden" type="submit">Отсортировать продукты</button>
            </form>
            <div class="sorting__toggles">
              <a class="sorting__toggle" href="#">
                <svg class="sorting__icon" width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg">
                  <path d="M6 0L11.5 10H0.5" />
                </svg>
              </a>
              <a class="sorting__toggle sorting__toggle--current" href="#">
                <svg class="sorting__icon" width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg">
                  <path d="M6 10L0.499999 9.61651e-07L11.5 0"/>
                </svg>
              </a>
            </div>
          </div>
          <div class="product">
            <ul class="product__list">
              <li class="product__card">
                <img class="product__image" src="./img/catalog-img-1.jpg" alt="" width="360" height="380">
                <div class="product__description">
                  <h4 class="product__title">Любительская<br> селфи-палка</h4>
                  <b class="product__price">500 ₽</b>
                </div>
              </li>
              <li class="product__card">
                <img class="product__image" src="./img/catalog-img-2.jpg" alt="" width="360" height="380">
                <div class="product__description">
                  <h4 class="product__title">Профессиональная<br> селфи-палка</h4>
                  <b class="product__price">1 500 ₽</b>
                </div>
              </li>
              <li class="product__card">
                <img class="product__image" src="./img/catalog-img-3.jpg" alt="" width="360" height="380">
                <div class="product__description">
                  <h4 class="product__title">Непотопляемая<br> селфи-палка</h4>
                  <b class="product__price">2 500 ₽</b>
                </div>
              </li>
              <li class="product__card">
                <img class="product__image" src="./img/catalog-img-4.jpg" alt="" width="360" height="380">
                <div class="product__description">
                  <h4 class="product__title">Селфи-палка "Следуй<br> за мной"</h4>
                  <b class="product__price">1 500 ₽</b>
                </div>
              </li>
            </ul>
            <button class="product__button button" type="button">Загрузить ещё</button>
            <div class="product__pagination pagination">
              <a class="pagination__link pagination__link--prev  button">Назад</a>
              <ul class="pagination__list">
                <li class="pagination__item">
                  <a class="pagination__link pagination--current" href="#">1</a>
                </li>
                <li class="pagination__item">
                  <a class="pagination__link" href="#">2</a>
                </li>
                <li class="pagination__item">
                  <a class="pagination__link" href="#">3</a>
                </li>
                <li class="pagination__item">
                  <a class="pagination__link" href="#">...</a>
                </li>
                <li class="pagination__item">
                  <a class="pagination__link" href="#">15</a>
                </li>
              </ul>
              <a class="pagination__link pagination__link--next button" href="#">Вперёд</a>
            </div>
          </div>
        </div>
    </section>
  </main>
  <footer class="page-footer">
    <div class="page-footer__wrapper">
      <div class="page-footer__section">
        <a class="page-footer__logo logo" href="index.html">
          <svg class="logo__icon" width="145" height="36" viewBox="0 0 145 36" fill="none"
            xmlns="http://www.w3.org/2000/svg">
            <path
              d="M27.2188 0V35.3H19.6135V32.9C17.9124 34.8 15.5107 36 12.1084 36C5.5038 36 0 30.2 0 22.7C0 15.2 5.5038 9.4 12.1084 9.4C15.5107 9.4 18.0124 10.6 19.6135 12.5V0H27.2188ZM19.6135 22.7C19.6135 18.9 17.1118 16.5 13.6094 16.5C10.107 16.5 7.60524 18.9 7.60524 22.7C7.60524 26.5 10.107 28.9 13.6094 28.9C17.1118 28.8 19.6135 26.5 19.6135 22.7Z" />
            <path
              d="M43.7298 29.1999C45.8313 29.1999 47.5325 28.3999 48.5332 27.2999L54.6374 30.7999C52.1356 34.1999 48.4331 35.9999 43.6298 35.9999C35.0238 35.9999 29.6201 30.1999 29.6201 22.6999C29.6201 15.1999 35.0238 9.3999 43.0294 9.3999C50.4345 9.3999 55.8382 15.0999 55.8382 22.6999C55.8382 23.7999 55.7381 24.7999 55.538 25.6999H37.6256C38.6263 28.2999 40.9279 29.1999 43.7298 29.1999ZM48.333 20.0999C47.5325 17.1999 45.2309 16.0999 42.9293 16.0999C40.0273 16.0999 38.126 17.4999 37.4255 20.0999H48.333Z" />
            <path
              d="M82.1563 10.1001L72.8499 35.3001H64.2439L54.9375 10.1001H63.3433L68.647 26.1001L73.9506 10.1001C73.9506 10.1001 82.1563 10.1001 82.1563 10.1001Z" />
            <path d="M83.458 10.1001H91.0633V35.3001H83.458V10.1001Z" />
            <path
              d="M93.665 22.6999C93.665 15.1999 99.369 9.3999 107.074 9.3999C111.978 9.3999 116.281 11.9999 118.482 15.8999L111.878 19.6999C110.977 17.8999 109.176 16.8999 106.974 16.8999C103.672 16.8999 101.27 19.2999 101.27 22.6999C101.27 26.1999 103.672 28.4999 106.974 28.4999C109.176 28.4999 111.077 27.3999 111.878 25.6999L118.482 29.4999C116.381 33.3999 112.078 35.9999 107.074 35.9999C99.369 35.9999 93.665 30.1999 93.665 22.6999Z" />
            <path
              d="M132.892 29.1999C134.993 29.1999 136.695 28.3999 137.695 27.2999L143.799 30.7999C141.298 34.1999 137.595 35.9999 132.792 35.9999C124.186 35.9999 118.782 30.1999 118.782 22.6999C118.782 15.1999 124.286 9.3999 132.191 9.3999C139.597 9.3999 145 15.0999 145 22.6999C145 23.7999 144.9 24.7999 144.7 25.6999H126.788C127.788 28.2999 130.09 29.1999 132.892 29.1999ZM137.595 20.0999C136.795 17.1999 134.493 16.0999 132.191 16.0999C129.289 16.0999 127.388 17.4999 126.688 20.0999H137.595Z" />
            <path d="M83.458 0V10.1L91.0633 0H83.458Z" />
          </svg>
        </a>
        <address class="page-footer__address">Санкт-Петербург, набережная
          реки Карповки, 5, литера П.</address>
      </div>
      <div class="page-footer__section page-footer__nav">
        <ul class="page-footer__list site-list">
          <li class="site-list__item">
            <a class="page-footer__link" href="#">Доставка</a>
          </li>
          <li class="site-list__item">
            <a class="page-footer__link" href="#">Гарантия</a>
          </li>
          <li class="site-list__item">
            <a class="page-footer__link" href="#">Контакты</a>
          </li>
        </ul>
        <ul class="page-footer__social social">
          <li class="social__item">
            <a class="social__link social__link--facebook" href="https://www.facebook.com/htmlacademy">
              <svg class="social__icon" width="9" height="18" viewBox="0 0 9 18" fill="none"
                xmlns="http://www.w3.org/2000/svg">
                <path d="M6.5 3H9V0H5.6C2.8 0 2 1.7 2 4.2V6H0V9H2V18H5V9H8.3L8.9 6H5V4.5C5 3.7 5.3 3 6.5 3Z" />
              </svg>
              <span class="visually-hidden">Мы в Фейсбуке</span>
            </a>
          </li>
          <li class="social__item">
            <a class="social__link social__link--instagram" href="https://www.instagram.com/htmlacademy">
              <svg class="social__icon" width="16" height="16" viewBox="0 0 16 16" fill="none"
                xmlns="http://www.w3.org/2000/svg">
                <path
                  d="M8 10C9.10457 10 10 9.10457 10 8C10 6.89543 9.10457 6 8 6C6.89543 6 6 6.89543 6 8C6 9.10457 6.89543 10 8 10Z" />
                <path
                  d="M14.7 1.3C13.8 0.4 12.7 0 11.3 0H4.7C1.9 0 0 1.9 0 4.7V11.3C0 12.7 0.4 13.9 1.4 14.7C2.3 15.6 3.4 16 4.7 16H11.3C12.7 16 13.9 15.6 14.7 14.7C15.5 13.8 16 12.7 16 11.3V4.7C16 3.3 15.6 2.1 14.7 1.3ZM8 12.1C5.8 12.1 3.9 10.3 3.9 8C3.9 5.7 5.8 3.9 8 3.9C10.2 3.9 12.1 5.7 12.1 8C12.1 10.3 10.2 12.1 8 12.1ZM12.6 4.7C11.9 4.7 11.3 4.2 11.3 3.4C11.3 2.6 11.8 2.1 12.6 2.1C13.3 2.1 13.9 2.7 13.9 3.4C13.9 4.1 13.3 4.7 12.6 4.7Z" />
              </svg>
              <span class="visually-hidden">Мы в Инстаграме</span>
            </a>
          </li>
          <li class="social__item">
            <a class="social__link social__link--twitter" href="https://twitter.com/htmlacademy">
              <svg class="social__icon" width="15" height="15" viewBox="0 0 15 15" fill="none"
                xmlns="http://www.w3.org/2000/svg">
                <path
                  d="M9.7 0.155143C11.2 -0.344857 12.3 0.455143 12.9 1.25514C13.4 1.05514 14 0.855143 14.6 0.655143C14.6 1.45514 14.1 2.05514 13.8 2.25514C14.5 2.45514 15 1.85514 15 1.85514C14.9 2.75514 14.1 3.55514 13.6 3.75514C13.4 10.0551 10.8 14.1551 4.7 14.0551C4.2 14.0551 4.8 14.0551 4.3 14.0551C4 14.0551 0.6 13.6551 0 12.2551C2 12.4551 3.4 11.8551 4.1 11.1551C3.3 10.8551 1.7 10.7551 1.5 8.35514C1.8 8.55514 2 8.65514 2.6 8.55514C1.5 7.75514 0.3 7.05514 0.4 5.05514C0.7 5.35514 1.3 5.55514 1.6 5.45514C1 5.25514 -0.2 2.35514 0.8 0.855143C2.4 2.55514 4.1 4.25514 7.1 4.35514C7.3 2.25514 8.1 0.855143 9.7 0.155143Z" />
              </svg>
              <span class="visually-hidden">Мы в Твиттер</span>
            </a>
          </li>
        </ul>
      </div>
      <div class="page-footer__section">
        <a class="page-footer__phone" href="tel:88128121212">+7 (812) 812-12-12</a>
        <a class="page-footer__copyright" href="https://htmlacademy.ru/intensive/adaptive">
          <svg width="115" height="33" viewBox="0 0 115 33" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path d="M0 12.9V15.5H2.5V12.9H0Z" />
            <path
              d="M11.6 4.5C10 4.5 8.8 5.2 8 6.2H7.9V0H5.9V15.5H7.9V10.2C7.9 8.1 9.2 6.6 11.2 6.6C13 6.6 14.1 8 14.1 9.8V15.5H16.1V9.4C16.2 6.4 14.3 4.5 11.6 4.5Z" />
            <path
              d="M26.6 4.8H21.8V1.1H19.8V4.9H17.9V6.9H19.8V12.9C19.8 14.6 20.8 15.6 22.5 15.6H26.6V13.6H22.9C22.2 13.6 21.8 13.2 21.8 12.5V6.8H26.6V4.8Z" />
            <path
              d="M41.1 4.6C39.5 4.6 38.2 5.4 37.6 6.7H37.5C36.9 5.5 35.7 4.6 34.1 4.6C32.7 4.6 31.6 5.4 31 6.4H30.9V4.8H29V15.4H31V10C31 8 32 6.5 33.6 6.5C35.1 6.5 36 7.5 36 9.1V15.4H38V9.8C38 7.4 39.4 6.5 40.6 6.5C42.1 6.5 43 7.5 43 9.1V15.4H45V8.9C45.1 6.4 43.6 4.6 41.1 4.6Z" />
            <path
              d="M47.8 12.7C47.8 14.4 48.8 15.4 50.6 15.4H52.6V13.4H50.9C50.2 13.4 49.8 13 49.8 12.3V0H47.8V12.7Z" />
            <path
              d="M28.9 19.7C28 18.6 26.7 17.9 25 17.9C21.9 17.9 19.6 20.2 19.6 23.5C19.6 26.8 21.9 29.1 25 29.1C26.8 29.1 28 28.3 28.8 27.2H28.9V28.8H30.9V18.2H28.9V19.7ZM25.3 27.1C23.1 27.1 21.7 25.5 21.7 23.5C21.7 21.5 23.1 19.9 25.3 19.9C27.5 19.9 28.9 21.5 28.9 23.5C28.9 25.4 27.5 27.1 25.3 27.1Z" />
            <path
              d="M44.2 22C43.7 19.6 41.6 17.9 38.8 17.9C35.4 17.9 33.2 20.4 33.2 23.5C33.2 26.6 35.4 29.1 38.8 29.1C41.6 29.1 43.7 27.3 44.2 24.9H42.1C41.7 26.2 40.4 27.2 38.8 27.2C36.6 27.2 35.2 25.6 35.2 23.6C35.2 21.6 36.6 20 38.8 20C40.4 20 41.6 21 42.1 22.2H44.2V22Z" />
            <path
              d="M55.1 19.7C54.2 18.6 52.9 17.9 51.2 17.9C48.1 17.9 45.8 20.2 45.8 23.5C45.8 26.8 48.1 29.1 51.2 29.1C53 29.1 54.2 28.3 55 27.2H55.1V28.8H57.1V18.2H55.1V19.7ZM51.5 27.1C49.3 27.1 47.9 25.5 47.9 23.5C47.9 21.5 49.3 19.9 51.5 19.9C53.7 19.9 55.1 21.5 55.1 23.5C55.1 25.4 53.6 27.1 51.5 27.1Z" />
            <path
              d="M68.7 19.8C67.8 18.7 66.5 17.9 64.8 17.9C61.7 17.9 59.4 20.2 59.4 23.5C59.4 26.8 61.6 29.1 64.8 29.1C66.5 29.1 67.8 28.3 68.6 27.3H68.7V28.8H70.7V13.4H68.7V19.8ZM65.1 27.1C62.9 27.1 61.5 25.5 61.5 23.5C61.5 21.5 62.9 19.9 65.1 19.9C67.3 19.9 68.7 21.5 68.7 23.5C68.6 25.5 67.2 27.1 65.1 27.1Z" />
            <path
              d="M78.3 17.9C75 17.9 72.8 20.4 72.8 23.5C72.8 26.5 74.9 29.1 78.3 29.1C80.8 29.1 82.8 27.8 83.5 25.5H81.4C80.9 26.5 79.8 27.1 78.4 27.1C76.5 27.1 75.1 25.8 75 24.2H83.8C84 20.6 81.8 17.9 78.3 17.9ZM78.3 19.8C80 19.8 81.3 20.8 81.6 22.4H75.1C75.4 20.9 76.6 19.8 78.3 19.8Z" />
            <path
              d="M98.2 17.9C96.6 17.9 95.3 18.7 94.6 19.9H94.5C93.9 18.7 92.7 17.9 91.1 17.9C89.7 17.9 88.6 18.6 88 19.7V18.2H86.1V28.8H88.1V23.4C88.1 21.4 89.1 20 90.7 19.9C92.2 19.9 93.1 20.9 93.1 22.5V28.8H95.1V23.2C95.1 20.8 96.5 19.9 97.7 19.9C99.2 19.9 100.1 20.9 100.1 22.5V28.8H102.1V22.3C102.2 19.7 100.7 17.9 98.2 17.9Z" />
            <path
              d="M109.4 27L105.8 18.1H103.6L108.4 29.7C108.1 30.6 107.7 30.9 106.7 30.9H104.2V32.9H106.7C108.5 32.9 109.5 32.1 110.2 30.3L114.9 18.1H112.8L109.4 27Z" />
          </svg>
          <span class="visually-hidden">HTML Academy</span>
        </a>
      </div>
    </div>
  </footer>
</body>

</html>
